<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.List" %>
<%@ page import="com.google.appengine.api.datastore.Entity" %>
<%@ page import="com.google.appengine.api.datastore.KeyFactory" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Rudeness</title>
        <link rel="stylesheet" type="text/css" href="/static/styles.css" /> 
</head>
<body>
<div id="todoapp">
	<h1>Top Rudenesses</h1>
	
	<div class="navigation">
        <a href="/">Home</a> | 
        <a href="/recent">Recent</a>
    </div>
	
	<div id="create-todo">
		<form action="/create" method="POST">
		    <p>
		    <input type="text" id="new-todo" name="body" 
		        placeholder="Create new rudeness"/>
		    </p>
		    <input type="submit" />
		</form>
	</div>
	
	<div id="rudenesses">
	    <ul id="todo-list">
	        <% 
	        List<Entity> rudenesses = (List<Entity>) request.getAttribute("rudenesses");
	        for(Entity rudeness : rudenesses) {
	        %>
	        <li>
	            <div class="rudeness-info">
	            <%= rudeness.getProperty("body") %>
	               <div class="uses-info">
	               Uses: <%= rudeness.getProperty("useCount") %>
	               </div>
	            </div>
	            <form action="/use" method="POST">
	                <input type="hidden" name="key" value="<%= KeyFactory.keyToString(rudeness.getKey()) %>" />
	                <input class="use-button" type="submit" value="use" />
	            </form>
	
	        </li>
	        <% 
	        }
	        %>
	    </ul>
	</div>
</div>
</body>
</html>